<template>
    <div>

        <div>
            <div v-for="(cate, index) in catelist" :key="index" v-if="cate.price">
                申请人：{{cate.staff}}<br>
                采购原因：{{cate.cause}}<br>
                价格：{{cate.price}}<br>
                <div v-for="(a1, index) in a1_list" :key="index">
                    审批人{{index+1}}：{{a1.username}}<br>
                </div>
                <a-button @click="get_status(cate.wid)">查看状态</a-button>
                <a-steps :current="num" status="wait">
                    <a-step>
                        <template slot="title">
                            Jack
                        </template>
                        <span slot="description">审批通过.</span>
                    </a-step>
                    <a-step title="Gentleman" description="审批通过." />
                    <a-step title="Finished" description="审批已通过." />
                </a-steps>
                
                <br><br>
            </div>
            

            <div v-for="(cate, index) in catelist" :key="index" v-if="cate.start_time">
                申请人：{{cate.staff}}<br>
                请假原因：{{cate.cause}}<br>
                开始时间：{{cate.start_time}}<br>
                结束时间：{{cate.end_time}}<br>
                <div v-for="(a, index) in a_list" :key="index">
                    审批人{{index+1}}：{{a.username}}<br>
                </div>
                <a-button @click="get_status(cate.wid)">查看状态</a-button>
                <a-steps :current="num2" status="wait">
                    <a-step>
                        <template slot="title">
                            teacher1
                        </template>
                        <span slot="description">审批通过.</span>
                    </a-step>
                    <a-step title="Gentleman" description="审批通过." />
                    <a-step title="Finished" description="审批已通过." />
                </a-steps>

            </div>

        </div>

    </div>
</template>

<script>
export default {
    data() {
        return {
            uid:localStorage.getItem('uid'),
            catelist:[],
            a_list:[],
            a1_list:[],
            pid:2,
            pid1:3,
            num:0,
            num2:0
        }
    },

    mounted:function(){

        this.axios.get("http://localhost:8000/getworkdetail/",{params:{'uid':this.uid}}).then(res=>{
            // console.log(res.data)
            this.catelist = res.data
        })

        this.get_approver()
        this.get_approver1()
    },

    methods:{
        get_approver(){
            this.axios.get("http://localhost:8000/getapprover/",{params:{'pid':this.pid}}).then(res=>{
                this.a_list = res.data
                // console.log(res.data)
            })
        },

        get_approver1(){
            this.axios.get("http://localhost:8000/getapprover/",{params:{'pid':this.pid1}}).then(res=>{
                this.a1_list = res.data
                // console.log(res.data)
            })
        },

        get_status(wid){
            this.axios.get("http://localhost:8000/getworkstatus/",{params:{'wid':wid}}).then(res=>{
                console.log(res.data)
                this.num = res.data.status
            })
        },

        get_status2(wid){
            this.axios.get("http://localhost:8000/getworkstatus/",{params:{'wid':wid}}).then(res=>{
                console.log(res.data)
                this.num2 = res.data.status
            })
        }
    }
}
</script>

<style>

</style>